<template>
    <div class='wrapper'>
      <div class="review">
        <div class="review-title">
          <h1>楼盘点评(81)</h1>
          <p>查看全部点评<span class="iconfont ">&#xe743</span></p>
        </div>
        <div class="review-content">
        <ul class="list">
          <li class="content-item">
            <div class="Headportrait">
              <img
                src="https://images-louxun-formal.oss-cn-shenzhen.aliyuncs.com/20190620/22004c8112434c3a8408b2adb38ee82a.png?x-oss-process=image/resize,w_100"
                alt="">
              <span>俩只老虎</span>
            </div>
            <p class="comments">项目的户型有什么可以选择的吗？团购有没有折扣打团购有没有折扣打</p>
            <div class="bottom-information">
              <span class="bottom-information-text">2019-11-16 11:32</span>
              <div class="Thumb-information">
                <div class="information-givelike">
                  <span class="iconfont">&#xe623;</span>
                  <span>123123</span>
                </div>
                <div class="information-comments">
                  <span class="iconfont">&#xe753;</span>
                  <span>444</span>
                </div>
              </div>
            </div>
          </li>
        </ul>
        <div class="bottom-btn">
          <span class="iconfont">&#xe62b;</span>
          <span>我要点评</span>
        </div>
      </div>
      </div>
    </div>
</template>

<script>
  export default {
    name: 'HotComments',
    data () {
      return {}
    }
  }
</script>

<style scoped lang="stylus">
  @import "~styles/varibles.styl"
  .review
    wrapper()
    margin-top .5rem
    TopBorder()

  .review-title
    display flex
    justify-content space-between
    line-height 1.3rem

  .review-title h1
    font-size .35rem
    font-weight bolder
  .review-title p
    line-height 1.3rem
  .content-item
    margin .4rem 0 0.3rem 0

  .Headportrait img
    width .6rem
    height .6rem
    border-radius .3rem

  .Headportrait span
    margin-left .2rem
    font-weight bold
    font-size .3rem

  .comments
    height auto
    padding .2rem 0 .3rem 0
    line-height .5rem

  .bottom-information
    display flex
    justify-content space-between
    color #798089

  .Thumb-information
    display flex
    justify-content space-between
    align-items center

  .information-givelike .iconfont, .information-comments .iconfont
    font-size .32rem

  .information-givelike,.information-comments
    margin-right .2rem


  .bottom-btn
    background #fcfdf5
    line-height 1rem
    color #a2c412
    border-radius .1rem
    display flex
    justify-content center
    align-items center


  .bottom-btn img
    width .5rem
    height .5rem

</style>

